/*

This file is part of Ext JS 4

Copyright (c) 2011 Sencha Inc

Contact:  http://www.sencha.com/contact

GNU General Public License Usage
This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file.  Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.

If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact.

*/
Ext.require(['*']);

//we want to setup a model and store instead of using dataUrl
Ext.define('itemFaseModel', {
	extend: 'Ext.data.Model',
	fields: [
		{name: 'nombreItem',     type: 'string'},
		{name: 'nombreFase',     type: 'string'}
		
	]
});

Ext.define('faseModel', {
	extend: 'Ext.data.Model',
	fields: [
		{name: 'nombreFase',     type: 'string'},
		{name: 'idFase',     type: 'string'},
		{name: 'descripcionFase',     type: 'string'},
		{name: 'fechaIniFase',     type: 'string'},
		{name: 'fechaFinFase',     type: 'string'}
	]
});








Ext.define('modelTipoItems', {
	extend: 'Ext.data.Model',
	proxy : {
		type : 'ajax',
		//actionMethods : 'POST',
		//url : '/roles', //application/controllers/Habitacion.php
		
		api: {
                read: '/items/viewTipoItems'
                //create: '/roles/create',
                //save: '/roles/update',
                //destroy: '/roles/destroy'
		},
	
		reader: {
				
                type: 'json',
                successProperty: 'success',
                root: 'tiposItems',
                messageProperty: 'message'
            }
	},
	
	fields: [
		{type: 'int' , name: 'idTipoItem'},
		{type: 'string', name: 'nombreTipoItem'}
		
			]
});




Ext.define('DesarrolloProyectoLiveSearchGridPanel', {
    extend: 'Ext.ux.LiveSearchGridPanel',
    
    initComponent: function() {
        
        //Ext.Msg.alert('Estoy en el initComponet del live!!!');
        var me = this;
        me.tbar = ['Buscar',{
                 xtype: 'textfield',
                 name: 'searchField',
                 hideLabel: true,
                 width: 200,
                 listeners: {
                     change: {
                         fn: me.onTextFieldChange,
                         scope: this,
                         buffer: 100
                     }
                 }
            }, {
                xtype: 'button',
                text: '<',
                tooltip: 'Anterior',
                handler: me.onPreviousClick,
                scope: me
            },{
                xtype: 'button',
                text: '>',
                tooltip: 'Siguiente',
                handler: me.onNextClick,
                scope: me
            }, '-', {
                xtype: 'checkbox',
                hideLabel: true,
                margin: '0 0 0 4px',
                handler: me.regExpToggle,
                scope: me                
            }, 'Expresión Regular', {
                xtype: 'checkbox',
                hideLabel: true,
                margin: '0 0 0 4px',
                handler: me.caseSensitiveToggle,
                scope: me
            }, 'Detectar Mayúsculas'];
        
        me.callParent(arguments);
    }
});


 Ext.define('Ext.form.ClosableFieldSet', {
	extend: 'Ext.form.FieldSet',
	alias: 'widget.closablefieldset'  
});







Ext.define('App.view.DesarrolloProyecto', {
	extend: 'Ext.panel.Panel',
    alias: 'widget.tabfirst',
    //title: 'Administación de Proyectos',
	layout:'anchor',

	initComponent: function () {
	
	    //para que funcionen los toolTips
	    Ext.QuickTips.init();
	    this.store = Ext.create('Ext.data.Store', {
		    storeId: 'itemsFaseStore',
			model: 'faseModel',
		    proxy: {
			    type: 'ajax',
				url: '/desarrolloProyecto/traerFases',
			    reader: {
				    type: 'json',
					root: 'fases'
			    }
		    } 
	    });

	    
	    this.myIdProyecto = idProyectoAux;
	    
        this.myNombreProyectoAux = nombreProyectoAux;
        
	    console.log('this.myIdProyecto = idProyectoAux;-->');
	    console.log(this.myIdProyecto);
	    
	    
	     //cargamos el store para que nos traiga todos los items de un determinado proyecto
	    this.store.load(
			    {
				    params:{idProyecto: idProyectoAux}
			    }
	    );
	    
	    
	    
	    this.grouping = Ext.create('Ext.grid.feature.Grouping', {
			    groupHeaderTpl: 'Fase: {name}',
			    enableGroupingMenu: false
		    }); 
	
		    this.idBtonCrearItem = 'btn_grid_crear_item' + this.myIdProyecto;
		    console.log(this.idBtonCrearItem);
		    
		this.idBtonListarItem = 'btn_grid_listar_item' + this.myIdProyecto;
		//console.log(this.idBtonCrearItem);
		    
		    //toolBar
		    this.Tblgrid = Ext.create('Ext.toolbar.Toolbar',{
			    items : [
				    {
					    xtype : 'button',
					id : this.idBtonListarItem,//'btn_grid_editar_rol',
					itemId : this.idBtonListarItem,//'btn_grid_editar_rol',
					text : 'Desarrollo de Items',
					    iconCls : 'icon_btn_grid_editar_rol',
					    disabled : true,
					tooltip : 'Administración de items en la fase seleccionada',
					    scope : this,
					handler : this.DesarrolloItemsRecordSelect
				    },{
					    xtype : 'tbseparator'
				    },{
					    xtype : 'button',
					    id : 'btn_grid_eliminar_rol',
					    itemId : 'btn_grid_eliminar_rol',
					    text : '',
					    iconCls : 'icon_btn_grid_eliminar_rol',
					    disabled : true,
					    tooltip : 'Eliminar el registro seleccionado',
					    scope : this,
					    handler : this.DeleteRecordSelect
				    },{
					    xtype : 'tbseparator'
				    }
			    ]
		    });
	
	
	
	
	
	
	
		    this.grid = Ext.create(/*'Ext.grid.Panel'*/ 'DesarrolloProyectoLiveSearchGridPanel', {
			    
			    frame : true,
			    store : this.store,
			    stripeRows : true,
			    columnLines: true,
			    loadMask : true,
			    //width : 550,
			    //height : 400,
			    anchor: '60% 90%', 
			//features: [this.grouping],
			    dockedItems : [this.Tblgrid,
				    Ext.create('Ext.ux.StatusBar', {
				    defaultText: this.defaultStatusText,
				    name: 'searchStatusBar'
				    })
			    ],
			    columns: 
			    [
				    {
						text: 'Fase',
						dataIndex: 'nombreFase',
						flex: 1
					},
					{
						text: 'Inicio Estimado',
						dataIndex: 'fechaIniFase',
						flex: 1
					},
					{
						text: 'Fin Estimado',
						dataIndex: 'fechaFinFase',
						flex: 1
					}
					,
					{
						text: 'Descripción',
						dataIndex: 'descripcionFase',
							flex: 1
					}
			    ],
			    bbar: Ext.create('Ext.PagingToolbar', {
				    store : this.store,
				    displayInfo : true,
				    displayMsg : 'Mostrando registros {0} - {1} de {2}',
				    emptyMsg : "Sin registros para mostrar"
			    }),
			    listeners:{
				    scope:this,     
				/*groupclick : function(view, node, group, e, eOpts){
					    console.log("en el listenerrrr, this.idBtonCrearItem");
					    console.log(this.idBtonCrearItem);
					    
					    Ext.getCmp(this.idBtonCrearItem).setDisabled(false);
					     
				},*/
				    
				    'selectionchange': function(view, records) {
					    
					Ext.getCmp(this.idBtonListarItem).setDisabled(false);
				    }
				       
			    }
			    
		    });
	    
	    
		    
		    this.items = [this.grid];
	    this.callParent(arguments);
			    
	    
		    this.grid.getStore().addListener('load', function(store, records, successful, operation, options){
			    if(successful){
				    if(records.length > 0){
					    var first = this.getStore().first();
					    var title = 'Desarrollar Proyecto'; //'Año: ' + first.get('anho') + ', Periodo: ' + first.get('periodoAnual') ;
					    this.setTitle(title);
				    }
			    }
		    }, this.grid);
        

	},
	
	
	
	
	
	DesarrolloItemsRecordSelect:function(){
		console.log('estoy en DesarrolloItemsRecordSelect!!!')
		registroSeleccionado = this.grid.getSelectionModel().getSelection()[0].data.idFase;	
		nombreFase = this.grid.getSelectionModel().getSelection()[0].data.nombreFase;	
		
		console.log(registroSeleccionado)
		
		var cls = "App.view.DesarrolloItem"; //+ node.raw.panel;
		var id = 'DesarrolloItem' + registroSeleccionado;//null ;//node.raw.panel;
		
		/*if( node.raw.idProyecto ){
			id = id + node.raw.idProyecto;
		}*/
		
		console.log(id);
		
		
		
		this.tabs = Ext.getCmp('tabsGlobales');
		
		var tab = this.tabs.child('#' + id);
		
		
		
		if(!tab){
			
			//setemamos el valor de la variable idFase
			idFaseAux = registroSeleccionado;
			nombreFaseAux = nombreFase;
			nombreProyectoAux = this.myNombreProyectoAux
			
			//Ext.Msg.alert('Entre en el if de !tab');
			tab = this.tabs.add(Ext.create(cls, {
                itemId: id,
                title: 'Desarrollo de Items | ' + nombreFase,//node.raw.text,
                closable: true
			}));	
		}
		this.tabs.setActiveTab(tab);
		
	},	
		
	
	
	
});


